<!doctype html>
<html lang="en">

<head>
   <!-- Required meta tags -->
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />

   <link href="https://block.codescandy.com/assets/libs/prismjs/themes/prism-okaidia.min.css" rel="stylesheet" />
   <!-- Favicon icon-->
   <link rel="apple-touch-icon" sizes="180x180"
      href="https://block.codescandy.com/assets/images/favicon/apple-touch-icon.png" />
   <link rel="icon" type="image/png" sizes="32x32"
      href="https://block.codescandy.com/assets/images/favicon/favicon-32x32.png" />
   <link rel="icon" type="image/png" sizes="16x16"
      href="https://block.codescandy.com/assets/images/favicon/favicon-16x16.png" />
   <link rel="manifest" href="https://block.codescandy.com/assets/images/favicon/site.webmanifest" />
   <link rel="mask-icon" href="https://block.codescandy.com/assets/images/favicon/block-safari-pinned-tab.svg"
      color="#8b3dff" />
   <link rel="shortcut icon" href="https://block.codescandy.com/assets/images/favicon/favicon.ico" />
   <meta name="msapplication-TileColor" content="#8b3dff" />
   <meta name="msapplication-config" content="https://block.codescandy.com/assets/images/favicon/tile.xml" />

   <!-- Color modes -->
   <script src="https://block.codescandy.com/assets/js/vendors/color-modes.js"></script>

   <!-- Libs CSS -->
   <link href="https://block.codescandy.com/assets/libs/simplebar/dist/simplebar.min.css" rel="stylesheet" />
   <link href="https://block.codescandy.com/assets/libs/bootstrap-icons/font/bootstrap-icons.min.css"
      rel="stylesheet" />

   <!-- Scroll Cue -->
   <link rel="stylesheet" href="https://block.codescandy.com/assets/libs/scrollcue/scrollCue.css" />

   <!-- Box icons -->
   <link rel="stylesheet" href="https://block.codescandy.com/assets/fonts/css/boxicons.min.css" />

   <!-- Theme CSS -->
   <link rel="stylesheet" href="https://block.codescandy.com/assets/css/theme.min.css">

   <title>Blog Snippet - Responsive Website Template | Block</title>
</head>

<body>
   <!-- Navbar -->
   <header>
      <nav class="navbar navbar-expand-lg  navbar-light w-100">
         <div class="container px-3">
            <a class="navbar-brand" href="../index.html"><img
                  src="https://block.codescandy.com/assets/images/logo/logo.svg" alt /></a>
            <button class="navbar-toggler offcanvas-nav-btn" type="button">
               <i class="bi bi-list"></i>
            </button>
            <div class="offcanvas offcanvas-start offcanvas-nav" style="width: 20rem">
               <div class="offcanvas-header">
                  <a href="../index.html" class="text-inverse"><img
                        src="https://block.codescandy.com/assets/images/logo/logo.svg" alt /></a>
                  <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
               </div>
               <div class="offcanvas-body pt-0 align-items-center">
                  <ul class="navbar-nav mx-auto align-items-lg-center">
                     <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                           aria-expanded="false">Landings</a>
                        <ul class="dropdown-menu">
                           <li><a class="dropdown-item" href="../index.html">Landing Overview</a></li>
                           <li>
                              <a class="dropdown-item" href="../landing-blog.html">Blog</a>
                           </li>
                           <li>
                              <a class="dropdown-item" href="../landing-ai-studio.html">AI Studio</a>
                           </li>
                           <li>
                              <a class="dropdown-item" href="../landing-mobile-app-showcase.html">Mobile App
                                 Showcase</a>
                           </li>

                           <li><a class="dropdown-item" href="../landing-sass-v1.html">Saas v.1</a></li>
                           <li><a class="dropdown-item" href="../landing-sass-v2.html">Sass v.2</a></li>
                           <li>
                              <a class="dropdown-item" href="../landing-it-company.html">IT Company</a>
                           </li>
                           <li>
                              <a class="dropdown-item" href="../landing-seo.html">Seo Agency</a>
                           </li>
                           <li><a class="dropdown-item" href="../landing-accounting.html">Accounting</a></li>
                           <li><a class="dropdown-item" href="../landing-finance.html">Finance</a></li>
                           <li><a class="dropdown-item" href="../landing-jamstack-agancy.html">Jamstack Agency</a></li>
                           <li><a class="dropdown-item" href="../landing-conference.html">Conference</a></li>
                           <li><a class="dropdown-item" href="../landing-personal.html">Personal</a></li>
                        </ul>
                     </li>
                     <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                           aria-expanded="false">Pages</a>
                        <div class="dropdown-menu dropdown-menu-xxl">
                           <div class="row row-cols-lg-4 row-cols-1 g-0">
                              <div class="col">
                                 <div>
                                    <div>
                                       <div class="dropdown-header">Blog</div>
                                       <a class="dropdown-item" href="../blog-list-view.html">List View</a>
                                       <a class="dropdown-item" href="../blog.html">Grid View</a>
                                       <a class="dropdown-item" href="../blog-grid-thumbnail.html">Grid View v.2</a>
                                       <a class="dropdown-item" href="../blog-sidebar.html">Sidebar</a>
                                       <a class="dropdown-item" href="../blog-category.html">Category</a>
                                       <a class="dropdown-item" href="../blog-single.html">Single Post</a>
                                    </div>
                                    <div class="mt-3">
                                       <div class="dropdown-header">About</div>
                                       <a class="dropdown-item" href="../about.html">About v.1</a>
                                       <a class="dropdown-item" href="../about-v2.html">About v.2</a>
                                    </div>
                                 </div>
                              </div>
                              <div class="col">
                                 <div class="mt-3 mt-lg-0">
                                    <div>
                                       <div class="dropdown-header">Service</div>
                                       <a class="dropdown-item" href="../service-v1.html">Service v.1</a>
                                       <a class="dropdown-item" href="../service-v2.html">Service v.2</a>
                                       <a class="dropdown-item" href="../service-v3.html">Service v.3</a>
                                    </div>
                                    <div class="mt-3">
                                       <div class="dropdown-header">Events</div>

                                       <a class="dropdown-item" href="../events.html">List</a>
                                       <a class="dropdown-item" href="../event-single.html">Single</a>
                                    </div>
                                    <div class="mt-3">
                                       <div class="dropdown-header">Contact</div>

                                       <a class="dropdown-item" href="../contact-1.html">Contact Us</a>
                                       <a class="dropdown-item" href="../contact-2.html">Contact Sales</a>
                                    </div>
                                 </div>
                              </div>
                              <div class="col">
                                 <div class="mt-3 mt-lg-0">
                                    <div>
                                       <div class="dropdown-header">Portfolio</div>

                                       <a class="dropdown-item" href="../portfolio.html">Grid View</a>
                                       <a class="dropdown-item" href="../portfolio-3-columns.html">3 Columns</a>

                                       <a class="dropdown-item" href="../portfolio-single.html">Single View</a>
                                    </div>
                                    <div class="mt-3">
                                       <div class="dropdown-header">Pricing</div>
                                       <a class="dropdown-item" href="../pricing-v1.html">Pricing v.1</a>
                                       <a class="dropdown-item" href="../pricing-v2.html">Pricing v.2</a>
                                    </div>
                                    <div class="mt-3">
                                       <div class="dropdown-header">Career</div>
                                       <a class="dropdown-item" href="../career.html">Career</a>
                                    </div>
                                 </div>
                              </div>
                              <div class="col">
                                 <div class="mt-3 mt-lg-0">
                                    <div>
                                       <div class="dropdown-header">Integration</div>
                                       <a class="dropdown-item" href="../integration.html">Grid View</a>
                                       <a class="dropdown-item" href="../integration-single.html">Single</a>
                                    </div>
                                    <div class="mt-3">
                                       <div>
                                          <div class="dropdown-header">Case Study</div>
                                          <a class="dropdown-item" href="../case-study.html">Grid View</a>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </li>
                     <li class="nav-item dropdown dropdown-fullwidth">
                        <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                           aria-expanded="false">Blocks</a>
                        <div class="dropdown-menu p-4">
                           <div class="row row-cols-xl-6 row-cols-lg-5 row-cols-1 gx-lg-4">
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/hero.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/hero-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Hero</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/navbar.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/header-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Navbar</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/about.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/about-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>About</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/blog.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/blog-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Blog</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/carousel.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/carousel-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Carousel</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/case-study.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/case-study-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Case Study</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/cta.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/call-to-action-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Call to Action</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/clients.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/clients-logo-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Client</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/contact.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/contact-section-example.svg"
                                          alt="" />
                                    </div>
                                    <span>Contact</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/form.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2"><img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/form-snippets-bootstrap.svg"
                                          alt="" /></div>
                                    <span>Form</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/faq.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2"><img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/faq-section-example.svg"
                                          alt="" /></div>
                                    <span>FAQ</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/team.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2"><img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/team-snippets-bootstrap.svg"
                                          alt="" /></div>
                                    <span>Team</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/footer.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/footer-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Footer</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/features.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/feature-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Features</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/integration.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/integration-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Integration</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/industry.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/industry-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Industry</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/location.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/location-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Location</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/portfolio.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/portfolio-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Portfolio</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/process.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/process-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Process</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/pricing.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2 bg-gray-200">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/pricing-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Pricing</span>
                                 </a>
                              </div>

                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/facts.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/stats-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Stats</span>
                                 </a>
                              </div>
                              <div class="col">
                                 <a class="dropdown-item d-block px-0 mb-lg-3" href="../blocks/testimonails.html">
                                    <div class="rounded d-none d-lg-block mb-lg-2">
                                       <img class="w-100 rounded-2"
                                          src="https://block.codescandy.com/assets/images/block/testimonial-snippets-bootstrap.svg"
                                          alt="" />
                                    </div>
                                    <span>Testimonials</span>
                                 </a>
                              </div>
                           </div>
                        </div>
                     </li>
                     <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                           aria-expanded="false">Accounts</a>
                        <ul class="dropdown-menu">
                           <li><a class="dropdown-item" href="../account-profile.html">Profile</a></li>
                           <li><a class="dropdown-item" href="../account-security.html">Security</a></li>
                           <li><a class="dropdown-item" href="../account-billing.html">Billing</a></li>
                           <li><a class="dropdown-item" href="../account-team.html">Team</a></li>
                           <li><a class="dropdown-item" href="../account-notification.html">Notifications</a></li>
                           <li><a class="dropdown-item" href="../account-app-integration.html">Integration</a></li>
                           <li><a class="dropdown-item" href="../account-device-session.html">Session</a></li>
                           <li><a class="dropdown-item" href="../account-social-links.html">Social</a></li>
                           <li><a class="dropdown-item" href="../account-appearance.html">Appearance</a></li>
                           <li class="dropdown-submenu dropend">
                              <a class="dropdown-item dropdown-toggle" href="#">Authentication</a>
                              <ul class="dropdown-menu">
                                 <li class="dropdown-header">Simple</li>

                                 <li>
                                    <a class="dropdown-item" href="../signin.html">Sign In</a>
                                 </li>
                                 <li>
                                    <a class="dropdown-item" href="../signup.html">Sign Up</a>
                                 </li>
                                 <li>
                                    <a class="dropdown-item" href="../forget-password.html">Forget Password</a>
                                 </li>
                                 <li>
                                    <a class="dropdown-item" href="../reset-password.html">Reset Password</a>
                                 </li>
                                 <li>
                                    <a class="dropdown-item" href="../otp-varification.html">OTP Varification</a>
                                 </li>
                                 <li>
                                    <hr class="dropdown-divider" />
                                 </li>
                                 <li class="dropdown-header">Side Cover</li>

                                 <li>
                                    <a class="dropdown-item" href="../signin-v2.html">Sign In</a>
                                 </li>

                                 <li>
                                    <a class="dropdown-item" href="../signup-v2.html">Sign Up</a>
                                 </li>

                                 <li>
                                    <a class="dropdown-item" href="../forget-password-v2.html">Forget Password</a>
                                 </li>
                                 <li>
                                    <a class="dropdown-item" href="../reset-password-v2.html">Reset Password</a>
                                 </li>
                                 <li>
                                    <a class="dropdown-item" href="../otp-varification-v2.html">OTP Varification</a>
                                 </li>
                              </ul>
                           </li>
                           <li class="dropdown-submenu dropend">
                              <a class="dropdown-item dropdown-toggle" href="#">Utility</a>
                              <ul class="dropdown-menu">
                                 <li>
                                    <a class="dropdown-item" href="../404-error.html">404 Error</a>
                                 </li>
                                 <li>
                                    <a class="dropdown-item" href="../changelog.html">Changelog</a>
                                 </li>
                              </ul>
                           </li>
                        </ul>
                     </li>
                     <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
                           data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Docs</a>
                        <div class="dropdown-menu dropdown-menu-md" aria-labelledby="navbarDropdown">
                           <a class="dropdown-item mb-3 text-body" href="../docs/index.html">
                              <div class="d-flex align-items-center">
                                 <i class="bi bi-file-text fs-4 text-primary"></i>
                                 <div class="ms-3 lh-1">
                                    <h5 class="mb-1">Documentations</h5>
                                    <p class="mb-0 fs-6">Browse the all documentation</p>
                                 </div>
                              </div>
                           </a>

                           <a class="dropdown-item text-body" href="../docs/changelog.html">
                              <div class="d-flex align-items-center">
                                 <i class="bi bi-clipboard fs-4 text-primary"></i>
                                 <div class="ms-3 lh-1">
                                    <h5 class="mb-1">
                                       Changelog
                                       <span class="text-primary ms-1"></span>
                                    </h5>
                                    <p class="mb-0 fs-6">See what's new</p>
                                 </div>
                              </div>
                           </a>
                        </div>
                     </li>
                  </ul>
                  <div class="mt-3 mt-lg-0 d-flex align-items-center">
                     <a href="../signin.html" class="btn btn-light mx-2">Login</a>
                     <a href="../signup.html" class="btn btn-primary">Create account</a>
                  </div>
               </div>
            </div>
         </div>
      </nav>
   </header>

   <main>
      <div class="pattern-square"></div>
      <section class="bg-light py-5 py-lg-8 bg-opacity-50">
         <div class="container">
            <div class="row">
               <div class="col-12 col-md-6">
                  <div>
                     <h1 class="mb-0">Blog Sections</h1>
                  </div>
               </div>
               <!-- Navbar Filter tabs -->
               <div class="mt-6 col-12 d-flex flex-wrap gap-2">
                  <a href="../blocks/about.html" class="filter-badge ">About</a>
                  <a href="../blocks/award.html" class="filter-badge ">Award</a>
                  <a href="../blocks/blog.html" class="filter-badge  active ">Blog</a>
                  <a href="../blocks/cta.html" class="filter-badge ">Call to Action</a>
                  <a href="../blocks/clients.html" class="filter-badge ">Clients</a>
                  <a href="../blocks/contact.html" class="filter-badge ">Contact</a>
                  <a href="../blocks/carousel.html" class="filter-badge ">Carousel</a>
                  <a href="../blocks/case-study.html" class="filter-badge ">Case Study</a>
                  <a href="../blocks/facts.html" class="filter-badge ">Facts</a>
                  <a href="../blocks/faq.html" class="filter-badge ">FAQ</a>
                  <a href="../blocks/features.html" class="filter-badge ">Features</a>
                  <a href="../blocks/form.html" class="filter-badge ">Form</a>
                  <a href="../blocks/footer.html" class="filter-badge ">Footer</a>
                  <a href="../blocks/hero.html" class="filter-badge ">Hero</a>
                  <a href="../blocks/integration.html" class="filter-badge ">Integration</a>
                  <a href="../blocks/industry.html" class="filter-badge ">Industry</a>
                  <a href="../blocks/location.html" class="filter-badge ">Location</a>
                  <a href="../blocks/navbar.html" class="filter-badge ">Navbar</a>
                  <a href="../blocks/portfolio.html" class="filter-badge ">Portfolio</a>
                  <a href="../blocks/pricing.html" class="filter-badge ">Pricing</a>
                  <a href="../blocks/process.html" class="filter-badge ">Process</a>
                  <a href="../blocks/services.html" class="filter-badge ">Services</a>
                  <a href="../blocks/team.html" class="filter-badge ">Team</a>
                  <a href="../blocks/testimonails.html" class="filter-badge ">Testimonials</a>
               </div>

            </div>
         </div>
      </section>
      <section class="py-lg-8 py-5">
         <div class="container">
            <div class="mb-lg-7 mb-5">
               <div class="row align-items-center">
                  <div class="col-lg-8 col-xl-9 col-7">
                     <div>
                        <h2 class="text-truncate h5 mb-0">Block #1</h2>
                     </div>
                  </div>
                  <div class="col-lg-4 col-xl-3 col-5 d-flex justify-content-end">
                     <ul class="nav nav-pills nav-custom-pill" id="pills-tabTwo" role="tablist">
                        <li class="nav-item">
                           <a class="nav-link active" id="pills-example-preview-tab" data-bs-toggle="pill"
                              href="#pills-example-preview" role="tab" aria-controls="pills-example-preview"
                              aria-selected="true">
                              <span class="lh-1"><i class="bi bi-eye"></i></span>
                              <span class="ms-2 d-none d-lg-block">Preview</span>
                           </a>
                        </li>
                        <li class="nav-item">
                           <a class="nav-link" id="pills-example-code-tab" data-bs-toggle="pill"
                              href="#pills-example-code" role="tab" aria-controls="pills-example-code"
                              aria-selected="false">
                              <span class="lh-1"><i class="bi bi-code"></i></span>
                              <span class="ms-2 d-none d-lg-block">Code</span>
                           </a>
                        </li>
                     </ul>
                  </div>
               </div>
               <div class="row">
                  <div class="col-md-12">
                     <div class="tab-content border mt-3 p-3 rounded-2" id="pills-tabTwoContent">
                        <div class="tab-pane tab-example-preview fade show active" id="pills-example-preview"
                           role="tabpanel" aria-labelledby="pills-example-preview-tab">
                           <!--Our articles start-->
                           <section>
                              <div class="container">
                                 <div class="row">
                                    <div class="col-lg-6 offset-lg-3">
                                       <div class="text-center mb-xl-7 mb-5">
                                          <h2 class="h1 mb-3">Our articles on agency</h2>
                                          <p class="mb-0">At least, not exclusively. Reduced recruiting costs, more
                                             efficient and effective communication.</p>
                                       </div>
                                    </div>
                                 </div>
                                 <!-- Blog Card -->
                                 <div class="table-responsive-lg">
                                    <div class="row g-5 flex-nowrap pb-4 pb-lg-0 me-5 me-lg-0">
                                       <article class="col-lg-4 col-md-6 col-12">
                                          <figure class="mb-4 zoom-img">
                                             <a href="../blog-single.html">
                                                <img
                                                   src="https://block.codescandy.com/assets/images/blog/blog-img-3.jpg"
                                                   alt="blog" class="img-fluid rounded-3" />
                                             </a>
                                          </figure>

                                          <a href="#!"
                                             class="badge bg-primary-subtle text-primary-emphasis rounded-pill text-uppercase">Startup</a>
                                          <h3 class="my-3 lh-base h4">
                                             <a href="../blog-single.html" class="text-reset">You will destroy yourself
                                                financially if you save</a>
                                          </h3>
                                          <div class="d-flex align-items-center justify-content-between mb-3 mb-md-0">
                                             <div class="d-flex align-items-center">
                                                <img
                                                   src="https://block.codescandy.com/assets/images/avatar/avatar-8.jpg"
                                                   alt="Avatar" class="avatar avatar-xs rounded-circle" />
                                                <div class="ms-2">
                                                   <a href="#" class="text-reset fs-6">Sandip Chauhan</a>
                                                </div>
                                             </div>
                                             <div class="ms-3"><span class="fs-6">Nov 26, 2023</span></div>
                                          </div>
                                       </article>
                                       <article class="col-lg-4 col-md-6 col-12">
                                          <figure class="mb-4 zoom-img">
                                             <a href="../blog-single.html">
                                                <img
                                                   src="https://block.codescandy.com/assets/images/blog/blog-img-5.jpg"
                                                   alt="blog" class="img-fluid rounded-3" />
                                             </a>
                                          </figure>

                                          <a href="#!"
                                             class="badge bg-warning-subtle text-warning-emphasis rounded-pill text-uppercase">Business</a>
                                          <h3 class="my-3 lh-base h4">
                                             <a href="../blog-single.html" class="text-reset">Block Template for startup
                                                business</a>
                                          </h3>
                                          <div class="d-flex align-items-center justify-content-between mb-3 mb-md-0">
                                             <div class="d-flex align-items-center">
                                                <img
                                                   src="https://block.codescandy.com/assets/images/avatar/avatar-6.jpg"
                                                   alt="Avatar" class="avatar avatar-xs rounded-circle" />
                                                <div class="ms-2">
                                                   <a href="#" class="text-reset fs-6">Anita Parmar</a>
                                                </div>
                                             </div>
                                             <div class="ms-3"><span class="fs-6">Nov 21, 2023</span></div>
                                          </div>
                                       </article>
                                       <article class="col-lg-4 col-md-6 col-12">
                                          <figure class="mb-4 zoom-img">
                                             <a href="../blog-single.html">
                                                <img
                                                   src="https://block.codescandy.com/assets/images/blog/blog-img-4.jpg"
                                                   alt="blog" class="img-fluid rounded-3" />
                                             </a>
                                          </figure>

                                          <a href="#!"
                                             class="badge bg-success-subtle text-success-emphasis rounded-pill text-uppercase">Digital</a>
                                          <h4 class="my-3 lh-base">
                                             <a href="../blog-single.html" class="text-reset">The power of doing nothing
                                                at all</a>
                                          </h4>
                                          <div class="d-flex align-items-center justify-content-between mb-3 mb-md-0">
                                             <div class="d-flex align-items-center">
                                                <img
                                                   src="https://block.codescandy.com/assets/images/avatar/avatar-4.jpg"
                                                   alt="Avatar" class="avatar avatar-xs rounded-circle" />
                                                <div class="ms-2">
                                                   <a href="#" class="text-reset fs-6">Jitu Chauhan</a>
                                                </div>
                                             </div>
                                             <div class="ms-3"><span class="fs-6">Nov 23, 2023</span></div>
                                          </div>
                                       </article>
                                    </div>
                                 </div>
                                 <div class="row">
                                    <div class="col-lg-12">
                                       <div class="mt-lg-8 mt-5">
                                          <a href="./blog.html" class="icon-link icon-link-hover text-dark">
                                             Read more news
                                             <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
                                                fill="currentColor" class="bi bi-arrow-right" viewBox="0 0 16 16">
                                                <path fill-rule="evenodd"
                                                   d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z" />
                                             </svg>
                                          </a>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           </section>
                           <!--Our articles end-->
                        </div>
                        <div class="tab-pane tab-example-code fade" id="pills-example-code" role="tabpanel"
                           aria-labelledby="pills-example-code-tab">
                           <pre class="language-markup" tabindex="0"><code class="language-markup"><span class="token comment">&lt;!--Our articles start--&gt;</span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>section</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>my-xl-9 my-5<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>container<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-lg-6 offset-lg-3<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text-center mb-xl-7 mb-5<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h2</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>h1 mb-3<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Our articles on agency<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h2</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-0<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>At least, not exclusively. Reduced
                        recruiting costs, more efficient and effective
                        communication.<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
        <span class="token comment">&lt;!-- Blog Card --&gt;</span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>table-responsive-lg<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row g-5 flex-nowrap pb-4 pb-lg-0 me-5 me-lg-0<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>article</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-lg-4 col-md-6 col-12<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>figure</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-4 zoom-img<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>../blog-single.html<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://block.codescandy.com/assets/images/blog/blog-img-3.jpg<span class="token punctuation">"</span></span>
                                <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>blog<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>img-fluid rounded-3<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>figure</span><span class="token punctuation">&gt;</span></span>

                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#!<span class="token punctuation">"</span></span>
                        <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>badge bg-primary-subtle text-primary-emphasis rounded-pill text-uppercase<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Startup<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>my-3 lh-base h4<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>../blog-single.html<span class="token punctuation">"</span></span>
                            <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text-reset<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>You will destroy yourself
                            financially if you save<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span>
                        <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex align-items-center justify-content-between mb-3 mb-md-0<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex align-items-center<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://block.codescandy.com/assets/images/avatar/avatar-8.jpg<span class="token punctuation">"</span></span>
                                <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Avatar<span class="token punctuation">"</span></span>
                                <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>avatar avatar-xs rounded-circle<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ms-2<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text-reset fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Sandip
                                    Chauhan<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ms-3<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Nov 26,
                                2023<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>article</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>article</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-lg-4 col-md-6 col-12<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>figure</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-4 zoom-img<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>../blog-single.html<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://block.codescandy.com/assets/images/blog/blog-img-5.jpg<span class="token punctuation">"</span></span>
                                <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>blog<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>img-fluid rounded-3<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>figure</span><span class="token punctuation">&gt;</span></span>

                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#!<span class="token punctuation">"</span></span>
                        <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>badge bg-warning-subtle text-warning-emphasis rounded-pill text-uppercase<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Business<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>my-3 lh-base h4<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>../blog-single.html<span class="token punctuation">"</span></span>
                            <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text-reset<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Block Template for startup
                            business<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span>
                        <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex align-items-center justify-content-between mb-3 mb-md-0<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex align-items-center<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://block.codescandy.com/assets/images/avatar/avatar-6.jpg<span class="token punctuation">"</span></span>
                                <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Avatar<span class="token punctuation">"</span></span>
                                <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>avatar avatar-xs rounded-circle<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ms-2<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text-reset fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Anita
                                    Parmar<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ms-3<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Nov 21,
                                2023<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>article</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>article</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-lg-4 col-md-6 col-12<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>figure</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-4 zoom-img<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>../blog-single.html<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://block.codescandy.com/assets/images/blog/blog-img-4.jpg<span class="token punctuation">"</span></span>
                                <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>blog<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>img-fluid rounded-3<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>figure</span><span class="token punctuation">&gt;</span></span>

                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#!<span class="token punctuation">"</span></span>
                        <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>badge bg-success-subtle text-success-emphasis rounded-pill text-uppercase<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Digital<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h4</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>my-3 lh-base<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>../blog-single.html<span class="token punctuation">"</span></span>
                            <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text-reset<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>The power of doing nothing at
                            all<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h4</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span>
                        <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex align-items-center justify-content-between mb-3 mb-md-0<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex align-items-center<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://block.codescandy.com/assets/images/avatar/avatar-4.jpg<span class="token punctuation">"</span></span>
                                <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Avatar<span class="token punctuation">"</span></span>
                                <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>avatar avatar-xs rounded-circle<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ms-2<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text-reset fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Jitu
                                    Chauhan<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ms-3<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Nov 23,
                                2023<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>article</span><span class="token punctuation">&gt;</span></span>
            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-lg-12<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mt-lg-8 mt-5<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>./blog.html<span class="token punctuation">"</span></span>
                        <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>icon-link icon-link-hover text-dark<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                        Read more news
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>svg</span> <span class="token attr-name">xmlns</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>http://www.w3.org/2000/svg<span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>16<span class="token punctuation">"</span></span>
                            <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>16<span class="token punctuation">"</span></span> <span class="token attr-name">fill</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>currentColor<span class="token punctuation">"</span></span>
                            <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>bi bi-arrow-right<span class="token punctuation">"</span></span> <span class="token attr-name">viewBox</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>0 0 16 16<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>path</span> <span class="token attr-name">fill-rule</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>evenodd<span class="token punctuation">"</span></span>
                                <span class="token attr-name">d</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>svg</span><span class="token punctuation">&gt;</span></span>
                    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
            <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>section</span><span class="token punctuation">&gt;</span></span>
<span class="token comment">&lt;!--Our articles end--&gt;</span></code></pre>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <div class="mb-lg-7 mb-5">
               <div class="row align-items-center">
                  <div class="col-lg-8 col-xl-9 col-7">
                     <div>
                        <h2 class="text-truncate h5 mb-0">Block #2</h2>
                     </div>
                  </div>
                  <div class="col-lg-4 col-xl-3 col-5 d-flex justify-content-end">
                     <ul class="nav nav-pills nav-custom-pill" id="pills-tabTwo" role="tablist">
                        <li class="nav-item">
                           <a class="nav-link active" id="pills-blog-second-preview-tab" data-bs-toggle="pill"
                              href="#pills-blog-second-preview" role="tab" aria-controls="pills-blog-second-preview"
                              aria-selected="true">
                              <span class="lh-1"><i class="bi bi-eye"></i></span>
                              <span class="ms-2 d-none d-lg-block">Preview</span>
                           </a>
                        </li>
                        <li class="nav-item">
                           <a class="nav-link" id="pills-blog-second-code-tab" data-bs-toggle="pill"
                              href="#pills-blog-second-code" role="tab" aria-controls="pills-blog-second-code"
                              aria-selected="false">
                              <span class="lh-1"><i class="bi bi-code"></i></span>
                              <span class="ms-2 d-none d-lg-block">Code</span>
                           </a>
                        </li>
                     </ul>
                  </div>
               </div>
               <div class="row">
                  <div class="col-md-12">
                     <div class="tab-content border mt-3 p-3 rounded-2" id="pills-tabTwoContent">
                        <div class="tab-pane tab-blog-second-preview fade show active" id="pills-blog-second-preview"
                           role="tabpanel" aria-labelledby="pills-blog-second-preview-tab">
                           <div style="max-width: 768px">
                              <a href="#!">
                                 <div class="card h-100 overflow-hidden">
                                    <div class="row h-100 g-0">
                                       <div class="col-md-5 image-blur" style="
                                                background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.8) 100%), url(https://block.codescandy.com/assets/images/blog/blog-img-2.jpg);
                                                background-position: center;
                                                background-repeat: no-repeat;
                                                background-size: cover;
                                             "></div>
                                       <div class="col-md-7">
                                          <div class="card-body d-flex flex-column gap-4">
                                             <div class="d-flex flex-row align-items-center justify-content-between">
                                                <span
                                                   class="badge bg-primary-subtle text-primary-emphasis rounded-pill text-uppercase">Sport</span>
                                                <div
                                                   class="bg-warning-subtle border border-warning-subtle text-warning icon-shape icon-sm rounded">
                                                   <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
                                                      fill="currentColor" class="bi bi-patch-check-fill"
                                                      viewBox="0 0 16 16">
                                                      <path
                                                         d="M10.067.87a2.89 2.89 0 0 0-4.134 0l-.622.638-.89-.011a2.89 2.89 0 0 0-2.924 2.924l.01.89-.636.622a2.89 2.89 0 0 0 0 4.134l.637.622-.011.89a2.89 2.89 0 0 0 2.924 2.924l.89-.01.622.636a2.89 2.89 0 0 0 4.134 0l.622-.637.89.011a2.89 2.89 0 0 0 2.924-2.924l-.01-.89.636-.622a2.89 2.89 0 0 0 0-4.134l-.637-.622.011-.89a2.89 2.89 0 0 0-2.924-2.924l-.89.01zm.287 5.984-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7 8.793l2.646-2.647a.5.5 0 0 1 .708.708" />
                                                   </svg>
                                                </div>
                                             </div>
                                             <div class="d-flex flex-column gap-2">
                                                <h3 class="mb-0 text-truncate h4">A deep introduction to Bootstrap Block
                                                   Themes</h3>
                                                <p class="mb-0 text-truncate">
                                                   Duis ut aliquip fugiat nulla aliquip mollit mollit ullamco est
                                                   labore. Nostrud cillum eu reprehenderit elit qui aliquip qui commodo
                                                   ad id elit. Ut
                                                   culpa nulla magna elit eiusmod proident qui id enim.
                                                </p>
                                             </div>
                                             <div class="d-flex align-items-center align-items-center gap-3">
                                                <div class="d-flex flex-row align-items-center gap-2">
                                                   <img
                                                      src="https://block.codescandy.com/assets/images/avatar/avatar-7.jpg"
                                                      alt="Avatar" class="avatar avatar-xs rounded-circle" />
                                                   <div class="mb-0 fs-6">Anita Parmar</div>
                                                </div>
                                                <span class="fs-6">Feb 28, 2025</span>
                                             </div>
                                          </div>
                                       </div>
                                    </div>
                                 </div>
                              </a>
                           </div>
                        </div>
                        <div class="tab-pane tab-blog-second-code fade" id="pills-blog-second-code" role="tabpanel"
                           aria-labelledby="pills-blog-second-code-tab">
                           <pre class="language-markup"
                              tabindex="0"><code class="language-markup">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#!<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>card h-100 overflow-hidden<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row h-100 g-0<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span>
          <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-md-5 image-blur<span class="token punctuation">"</span></span>
          <span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>
             background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.8) 100%), url(https://block.codescandy.com/assets/images/blog/blog-img-2.jpg);
             background-position: center;
             background-repeat: no-repeat;
             background-size: cover;
          <span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-md-7<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
          <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>card-body d-flex flex-column gap-4<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex flex-row align-items-center justify-content-between<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>badge bg-primary-subtle text-primary-emphasis rounded-pill text-uppercase<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Sport<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>bg-warning-subtle border border-warning-subtle text-warning icon-shape icon-sm rounded<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>svg</span> <span class="token attr-name">xmlns</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>http://www.w3.org/2000/svg<span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>16<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>16<span class="token punctuation">"</span></span> <span class="token attr-name">fill</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>currentColor<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>bi bi-patch-check-fill<span class="token punctuation">"</span></span> <span class="token attr-name">viewBox</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>0 0 16 16<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                      <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>path</span>
                         <span class="token attr-name">d</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>M10.067.87a2.89 2.89 0 0 0-4.134 0l-.622.638-.89-.011a2.89 2.89 0 0 0-2.924 2.924l.01.89-.636.622a2.89 2.89 0 0 0 0 4.134l.637.622-.011.89a2.89 2.89 0 0 0 2.924 2.924l.89-.01.622.636a2.89 2.89 0 0 0 4.134 0l.622-.637.89.011a2.89 2.89 0 0 0 2.924-2.924l-.01-.89.636-.622a2.89 2.89 0 0 0 0-4.134l-.637-.622.011-.89a2.89 2.89 0 0 0-2.924-2.924l-.89.01zm.287 5.984-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7 8.793l2.646-2.647a.5.5 0 0 1 .708.708<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>svg</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex flex-column gap-2<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-0 text-truncate h4<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>A deep introduction to Bootstrap Block Themes<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-0 text-truncate<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                   Duis ut aliquip fugiat nulla aliquip mollit mollit ullamco est labore. Nostrud cillum eu reprehenderit elit qui aliquip qui commodo ad id elit. Ut culpa nulla
                   magna elit eiusmod proident qui id enim.
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex align-items-center align-items-center gap-3<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex flex-row align-items-center gap-2<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://block.codescandy.com/assets/images/avatar/avatar-7.jpg<span class="token punctuation">"</span></span> <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Avatar<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>avatar avatar-xs rounded-circle<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                   <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-0 fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Anita Parmar<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Feb 28, 2025<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
          <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                              <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span></code></pre>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <div class="mb-lg-7 mb-5">
               <div class="row align-items-center">
                  <div class="col-lg-8 col-xl-9 col-7">
                     <div>
                        <h2 class="text-truncate h5 mb-0">Block #3</h2>
                     </div>
                  </div>
                  <div class="col-lg-4 col-xl-3 col-5 d-flex justify-content-end">
                     <ul class="nav nav-pills nav-custom-pill" id="pills-tabTwo" role="tablist">
                        <li class="nav-item">
                           <a class="nav-link active" id="pills-blog-third-preview-tab" data-bs-toggle="pill"
                              href="#pills-blog-third-preview" role="tab" aria-controls="pills-blog-third-preview"
                              aria-selected="true">
                              <span class="lh-1"><i class="bi bi-eye"></i></span>
                              <span class="ms-2 d-none d-lg-block">Preview</span>
                           </a>
                        </li>
                        <li class="nav-item">
                           <a class="nav-link" id="pills-blog-third-code-tab" data-bs-toggle="pill"
                              href="#pills-blog-third-code" role="tab" aria-controls="pills-blog-third-code"
                              aria-selected="false">
                              <span class="lh-1"><i class="bi bi-code"></i></span>
                              <span class="ms-2 d-none d-lg-block">Code</span>
                           </a>
                        </li>
                     </ul>
                  </div>
               </div>
               <div class="row">
                  <div class="col-md-12">
                     <div class="tab-content border mt-3 p-3 rounded-2" id="pills-tabTwoContent">
                        <div class="tab-pane tab-blog-third-preview fade show active" id="pills-blog-third-preview"
                           role="tabpanel" aria-labelledby="pills-blog-third-preview-tab">
                           <div style="max-width: 390px">
                              <a href="#!">
                                 <div class="rounded-3 p-4 image-blur" style="
                                          background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.8) 100%), url(https://block.codescandy.com/assets/images/blog/blog-img-3.jpg);
                                          background-position: center;
                                          background-repeat: no-repeat;
                                          background-size: cover;
                                       ">
                                    <div class="d-flex flex-column gap-10">
                                       <div>
                                          <span
                                             class="badge border rounded-pill border-white text-white-stable px-3 py-2 fw-medium fs-6">Sport</span>
                                       </div>
                                       <div class="d-flex flex-column gap-4">
                                          <div class="d-flex flex-column gap-1">
                                             <h3 class="mb-0 text-white-stable text-truncate">The writing trends that
                                                will define 2025 (Get Excited)</h3>
                                             <p class="mb-0 text-white-stable text-truncate">
                                                Mollit minim officia commodo voluptate reprehenderit incididunt ullamco
                                                qui consectetur. Minim eiusmod elit quis non non elit id enim aliquip
                                                nisi
                                                eu.
                                             </p>
                                          </div>
                                          <div class="d-flex align-items-center align-items-center gap-3">
                                             <div class="d-flex flex-row align-items-center gap-2">
                                                <img
                                                   src="https://block.codescandy.com/assets/images/avatar/avatar-1.jpg"
                                                   alt="Avatar" class="avatar avatar-xs rounded-circle" />
                                                <div class="mb-0 text-white-stable fs-6">Jitu Chauhan</div>
                                             </div>
                                             <span class="text-white-stable fs-6">Feb 28, 2025</span>
                                          </div>
                                       </div>
                                    </div>
                                 </div>
                              </a>
                           </div>
                        </div>
                        <div class="tab-pane tab-blog-third-code fade" id="pills-blog-third-code" role="tabpanel"
                           aria-labelledby="pills-blog-third-code-tab">
                           <pre class="language-markup"
                              tabindex="0"><code class="language-markup">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#!<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span>
    <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>rounded-3 p-4 image-blur<span class="token punctuation">"</span></span>
    <span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>
       background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.8) 100%), url(https://block.codescandy.com/assets/images/blog/blog-img-3.jpg);
       background-position: center;
       background-repeat: no-repeat;
       background-size: cover;
    <span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex flex-column gap-10<span class="token punctuation">"</span></span> <span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">&gt;</span></span>
          <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>badge border rounded-pill border-white text-white-stable px-3 py-2 fw-medium fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Sport<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex flex-column gap-4<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
          <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex flex-column gap-1<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h3</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-0 text-white-stable text-truncate<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>The writing trends that will define 2025 (Get Excited)<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h3</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-0 text-white-stable text-truncate<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                Mollit minim officia commodo voluptate reprehenderit incididunt ullamco qui consectetur. Minim eiusmod elit quis non non elit id enim aliquip nisi eu.
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">&gt;</span></span>
          <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
          <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex align-items-center align-items-center gap-3<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>d-flex flex-row align-items-center gap-2<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://block.codescandy.com/assets/images/avatar/avatar-1.jpg<span class="token punctuation">"</span></span> <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Avatar<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>avatar avatar-xs rounded-circle<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
                <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mb-0 text-white-stable fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Jitu Chauhan<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
             <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text-white-stable fs-6<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Feb 28, 2025<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span>
          <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
                              <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a</span><span class="token punctuation">&gt;</span></span></code></pre>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </section>
   </main>
   <footer class="pt-7">
      <div class="container">
         <!-- Footer 4 column -->
         <div class="row">
            <div class="col-lg-9 col-12">
               <div class="row" id="ft-links">
                  <div class="col-lg-3 col-12">
                     <div class="position-relative">
                        <div class="mb-3 pb-2 d-flex justify-content-between border-bottom border-bottom-lg-0">
                           <h4>Service</h4>
                           <a class="d-block d-lg-none stretched-link text-body" data-bs-toggle="collapse"
                              href="#collapseLanding" role="button" aria-expanded="true"
                              aria-controls="collapseLanding">
                              <i class="bi bi-chevron-down"></i>
                           </a>
                        </div>
                        <div class="d-lg-block collapse show" id="collapseLanding" data-bs-parent="#ft-links" style="">
                           <ul class="list-unstyled mb-0 py-3 py-lg-0">
                              <li class="mb-2">
                                 <a href="./index.html" class="text-decoration-none text-reset">Web App Development</a>
                              </li>
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">Front End Development</a>
                              </li>
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">MVP Development</a>
                              </li>
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">Digital Marketing</a>
                              </li>
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">Content Writing</a>
                              </li>
                           </ul>
                        </div>
                     </div>
                  </div>
                  <div class="col-lg-3 col-12">
                     <div>
                        <div
                           class="mb-3 pb-2 d-flex justify-content-between border-bottom border-bottom-lg-0 position-relative">
                           <h4>About us</h4>
                           <a class="d-block d-lg-none stretched-link text-body collapsed" data-bs-toggle="collapse"
                              href="#collapseAccounts" role="button" aria-expanded="false"
                              aria-controls="collapseAccounts">
                              <i class="bi bi-chevron-down"></i>
                           </a>
                        </div>
                        <div class="collapse d-lg-block" id="collapseAccounts" data-bs-parent="#ft-links">
                           <ul class="list-unstyled mb-0 py-3 py-lg-0">
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">Case Studies</a>
                              </li>
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">Blog</a>
                              </li>
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">Services</a>
                              </li>
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">About</a>
                              </li>
                              <li class="mb-2">
                                 <a href="#!" class="text-decoration-none text-reset">Career</a>
                              </li>
                           </ul>
                        </div>
                     </div>
                  </div>
                  <div class="col-lg-3 col-12">
                     <div
                        class="mb-3 pb-2 d-flex justify-content-between border-bottom border-bottom-lg-0 position-relative">
                        <h4>Technology</h4>
                        <a class="d-block d-lg-none stretched-link text-body collapsed" data-bs-toggle="collapse"
                           href="#collapseResources" role="button" aria-expanded="false"
                           aria-controls="collapseResources">
                           <i class="bi bi-chevron-down"></i>
                        </a>
                     </div>
                     <div class="collapse d-lg-block" id="collapseResources" data-bs-parent="#ft-links">
                        <ul class="list-unstyled mb-0 py-3 py-lg-0">
                           <li class="mb-2">
                              <a href="./docs/index.html" class="text-decoration-none text-reset">Next.js</a>
                           </li>
                           <li class="mb-2">
                              <a href="#!" class="text-decoration-none text-reset">Sanity</a>
                           </li>
                           <li class="mb-2">
                              <a href="./changelog.html" class="text-decoration-none text-reset">Content ful</a>
                           </li>
                           <li class="mb-2">
                              <a href="#!" class="text-decoration-none text-reset">Vercel</a>
                           </li>
                           <li class="mb-2">
                              <a href="#!" class="text-decoration-none text-reset">Netlify</a>
                           </li>
                        </ul>
                     </div>
                  </div>
                  <div class="col-lg-3 col-12">
                     <div
                        class="mb-3 pb-2 d-flex justify-content-between border-bottom border-bottom-lg-0 position-relative">
                        <h4>Locations</h4>
                        <a class="d-block d-lg-none stretched-link text-body collapsed" data-bs-toggle="collapse"
                           href="#collapseLocations" role="button" aria-expanded="false"
                           aria-controls="collapseLocations">
                           <i class="bi bi-chevron-down"></i>
                        </a>
                     </div>
                     <div class="collapse d-lg-block" id="collapseLocations" data-bs-parent="#ft-links">
                        <ul class="list-unstyled mb-0 py-3 py-lg-0">
                           <li class="mb-2">
                              <a href="./docs/index.html" class="text-decoration-none text-reset">India</a>
                           </li>
                           <li class="mb-2">
                              <a href="#!" class="text-decoration-none text-reset">Australia</a>
                           </li>
                           <li class="mb-2">
                              <a href="./changelog.html" class="text-decoration-none text-reset">Brazil</a>
                           </li>
                           <li class="mb-2">
                              <a href="#!" class="text-decoration-none text-reset">Canada</a>
                           </li>
                        </ul>
                     </div>
                  </div>
               </div>
            </div>
            <div class="col-lg-3 col-12">
               <div class="me-7">
                  <h4 class="mb-4">Headquarters</h4>
                  <p class="text-body-secondary">Codescandy, 412, Residency Rd, Shanthala Nagar, Ashok Nagar, Bengaluru,
                     Karnataka, India 560025</p>
               </div>
            </div>
         </div>
      </div>
      <div class="container mt-7 pt-lg-7 pb-4">
         <div class="row align-items-center">
            <div class="col-md-3">
               <a class="mb-4 mb-lg-0 d-block text-inverse" href="../index.html"><img
                     src="https://block.codescandy.com/assets/images/logo/logo.svg" alt="" /></a>
            </div>
            <div class="col-md-9 col-lg-6">
               <div class="small mb-3 mb-lg-0 text-lg-center">
                  Copyright © 2024

                  <span class="text-primary"><a href="#">Block Bootstrap 5 Theme</a></span>
                  | Designed by
                  <span class="text-primary"><a href="#">CodesCandy</a></span>
               </div>
            </div>
            <div class="col-lg-3">
               <div class="text-lg-end d-flex align-items-center justify-content-lg-end">
                  <div class="dropdown">
                     <button class="btn btn-light btn-icon rounded-circle d-flex align-items-center" type="button"
                        aria-expanded="false" data-bs-toggle="dropdown" aria-label="Toggle theme (auto)">
                        <i class="bi theme-icon-active lh-1"><i class="bi theme-icon bi-sun-fill"></i></i>
                        <span class="visually-hidden bs-theme-text">Toggle theme</span>
                     </button>
                     <ul class="dropdown-menu dropdown-menu-end shadow" aria-labelledby="bs-theme-text">
                        <li>
                           <button type="button" class="dropdown-item d-flex align-items-center active"
                              data-bs-theme-value="light" aria-pressed="true">
                              <i class="bi theme-icon bi-sun-fill"></i>
                              <span class="ms-2">Light</span>
                           </button>
                        </li>
                        <li>
                           <button type="button" class="dropdown-item d-flex align-items-center"
                              data-bs-theme-value="dark" aria-pressed="false">
                              <i class="bi theme-icon bi-moon-stars-fill"></i>
                              <span class="ms-2">Dark</span>
                           </button>
                        </li>
                        <li>
                           <button type="button" class="dropdown-item d-flex align-items-center"
                              data-bs-theme-value="auto" aria-pressed="false">
                              <i class="bi theme-icon bi-circle-half"></i>
                              <span class="ms-2">Auto</span>
                           </button>
                        </li>
                     </ul>
                  </div>
                  <div class="ms-3 d-flex gap-2">
                     <a href="#!" class="btn btn-instagram btn-light btn-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
                           class="bi bi-instagram" viewBox="0 0 16 16">
                           <path
                              d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z">
                           </path>
                        </svg>
                     </a>
                     <a href="#!" class="btn btn-facebook btn-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
                           class="bi bi-facebook" viewBox="0 0 16 16">
                           <path
                              d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951z">
                           </path>
                        </svg>
                     </a>
                     <a href="#!" class="btn btn-twitter btn-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
                           class="bi bi-twitter" viewBox="0 0 16 16">
                           <path
                              d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z">
                           </path>
                        </svg>
                     </a>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </footer>
   <div class="btn-scroll-top">
      <svg class="progress-square svg-content" width="100%" height="100%" viewBox="0 0 40 40">
         <path
            d="M8 1H32C35.866 1 39 4.13401 39 8V32C39 35.866 35.866 39 32 39H8C4.13401 39 1 35.866 1 32V8C1 4.13401 4.13401 1 8 1Z" />
      </svg>
   </div>
   <!-- Libs JS -->
   <script src="https://block.codescandy.com/assets/libs/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
   <script src="https://block.codescandy.com/assets/libs/simplebar/dist/simplebar.min.js"></script>
   <script src="https://block.codescandy.com/assets/libs/headhesive/dist/headhesive.min.js"></script>

   <!-- Theme JS -->
   <script src="https://block.codescandy.com/assets/js/theme.min.js"></script>

   <script src="https://block.codescandy.com/assets/libs/prismjs/prism.js"></script>
   <script src="https://block.codescandy.com/assets/libs/prismjs/components/prism-scss.min.js"></script>
   <script src="https://block.codescandy.com/assets/libs/prismjs/plugins/toolbar/prism-toolbar.min.js"></script>
   <script
      src="https://block.codescandy.com/assets/libs/prismjs/plugins/copy-to-clipboard/prism-copy-to-clipboard.min.js"></script>
   s
</body>

</html>